home *** CD-ROM | disk | FTP | other *** search
/ MacAddict 123 / MacAddict_123_2006_11.iso / Software / Internet & Communication / Sandvox 1.0.4.dmg / Sandvox.app / Contents / Designs / Vector.svxDesign / main.css < prev    next >
Cascading Style Sheet File  |  2006-08-04  |  9KB  |  423 lines
  1. /* 
  2.    css Copyright (c) 2005-2006 by Karelia Software. All rights reserved.
  3.    css released under Creative Commons License 
  4.         - http://creativecommons.org/licenses/by-sa/2.5/ 
  5.    All associated graphics belong to their respective owners 
  6.         and are licensed separately. 
  7. */
  8.  
  9. a img { border: none; }
  10.  
  11. .clear { clear: both; height: 0; }
  12. .hidden { display:none; }
  13.  
  14. a { color: #e6f564; }
  15. #page-content a:hover { text-decoration: none; }
  16.  
  17. h1,h2,h3,h4,h5,h6 {
  18.     margin-top: .6em;
  19.     font-family: "century gothic","helvetica neue",helvetica,arial,sans-serif;
  20.     font-weight: normal;
  21. }
  22. /*\*/
  23. * html h1,* html h2,* html h3,* html h4,* html h5,* html h6 { font-weight: normal; }
  24. /**/
  25.  
  26. img.narrow { display:block; clear:right; float:right; margin: 6px 0 6px 6px; }
  27. img.wide { display:block; clear: both;}
  28.  
  29. body {
  30.     margin: 0;
  31.     font-size: 76%;
  32.     font-family: "Helvetica Neue",helvetica,arial,sans-serif;
  33.     background: #38b64a url(bodybg.jpg) repeat-x top left;
  34.     word-wrap:break-word;
  35. }
  36.  
  37. #page {
  38.     margin: 0 auto 10px auto;
  39.     width: 763px;
  40.     background: url(mod_mainareabg.gif) repeat-y top left;
  41. }
  42.  
  43. #sidebar-container {
  44.     width: 231px;
  45.     margin-right: 12px;
  46.     float: right;
  47.     word-wrap: break-word;
  48. }
  49.  
  50. * html #sidebar-container { margin-right: 0px; }
  51. /*\*/
  52. * html #sidebar-container { margin-right: 6px;  }
  53. /**/
  54.  
  55. #sidebar { line-height: 1.3em; font-size: .9em; background: #6a91b4; }
  56.  
  57. #sidebar-top { height: 13px; margin-bottom: -8px; background: url(mod_sidebartopbg.gif) no-repeat top left; }
  58. #sidebar-bottom { height: 13px;  background: url(mod_sidebarbottombg.gif) no-repeat top left; }
  59. #sidebar-content { margin: 0 5px; }
  60.  
  61. * html #sidebar-bottom { margin-bottom: -1px; }
  62.  
  63. #main {
  64.     width: 461px;
  65.     float: left;
  66.     margin-left: 12px;
  67.     color: #2c557c;
  68. }
  69. /*\*/
  70. * html #main { margin-left: 6px; }
  71. /**/
  72.  
  73. .no-sidebar #main { width: 720px; float: none; margin-left: 12px; }
  74.  
  75. * html .no-sidebar #main { margin-left: 0; padding-left: 12px; }
  76.  
  77. #main-top { background: url(mod_contenttopbg.gif) no-repeat bottom left; height: 13px; }
  78. #main-content {    padding: 0 12px; background: #97bfe3;}
  79.  
  80. #main-bottom { background: url(mod_contentbottombg.gif) no-repeat top left; height: 13px; }
  81.  
  82. .no-sidebar #main-bottom { background: url(nobar-contentbg-bottom.gif) no-repeat bottom left; height: 10px; }
  83. .no-sidebar #main-top { background: url(nobar-contentbg-top.gif) no-repeat top left; height: 10px; }
  84.  
  85. * html #main-content { padding: 0 6px; }
  86.  
  87. #page-top {
  88.     background: url(headerbg_bottom.gif) no-repeat bottom left;
  89.     position: relative;
  90. }
  91.  
  92.     #title {
  93.         min-height: 50px;
  94.         padding: 35px 12px 0 23px;
  95.         background: url(headerbg_top.gif) no-repeat top left;
  96.     }
  97.     /* kill from ie5/mac \*/
  98.     * html #title { height: 50px; }
  99.     /* end kill */
  100.  
  101.     #title span{ float: left; }
  102.     #title span span, #title span b, #title span i, #title p span, #title p b, #title p i {float: none;}
  103.     #title span img { border: none; display: block; margin-bottom: 15px; }
  104.  
  105.     #title h1 {
  106.         float: left;
  107.         margin: 13px 0 0 24px;
  108.         font-size: 1.3em;
  109.          color: #fff;
  110.          width: 460px;
  111.     }
  112.  
  113.     #title h1 a { color: #fff; text-decoration: none; }
  114.     #title h1 a:hover { text-decoration: underline; }
  115.  
  116.     #title p {
  117.         float: left;
  118.         width: 460px;
  119.         margin: 15px 0 0 24px;
  120.         color: #97bfe3;
  121.     }
  122.  
  123.     #sitemenu-container {
  124.         clear: both;
  125.     }
  126.  
  127. #sitemenu-content {
  128.     height: 44px;
  129.     font-size: .9em;
  130. }
  131.  
  132.     #sitemenu-content ul {
  133.         list-style: none;
  134.         margin: 0;
  135.         padding: 11px 30px 20px 30px;
  136.     }
  137.  
  138.     /* hack ie/mac */
  139.     * html #sitemenu-content ul { padding-top: 22px; }
  140.     /*\*/
  141.     * html #sitemenu-content ul { padding-top: 11px; }
  142.     /**/
  143.  
  144.     #sitemenu-content li {
  145.         margin: 0 15px 0 0;
  146.         padding: 0;
  147.         float: left;
  148.         font-weight: normal;
  149.     }
  150.  
  151.         #sitemenu-content a, .currentPage span.in, .currentPage { }
  152.         #sitemenu-content a:link, #sitemenu-content a:visited {  }
  153.         #sitemenu-content a:hover, #sitemenu-content a:active { color: #fff; }
  154.  
  155.         .currentPage span.in, .currentPage {  color: #fff;text-decoration: none }
  156.  
  157. #page-content {
  158.     padding: 0px 9px;
  159.     color: #fff;
  160.     background: url(mod_mainareabg.gif) repeat-y top left;
  161. }
  162. /*\*/
  163. * html .no-sidebar #page-content { margin-top: -16px; margin-bottom: -16px; }
  164. /**/
  165.  
  166. .no-sidebar #page-content { background: url(nobar-mainareabg.gif) repeat-y top left; }
  167.  
  168. #page-content a { font-weight: bold; }
  169.  
  170. .pagelet {
  171.     width:221px;
  172.     word-wrap:break-word;
  173.     overflow:hidden;
  174. }
  175.  
  176.     .pagelet h4 {
  177.         padding: 0 8px;
  178.         color: #fff;
  179.         padding: 5px 0 0 0;
  180.     }
  181.  
  182.     .pagelet h4 span.in { display: block; padding: 4px 8px 9px 8px; }
  183.  
  184.     #main .o h4 { background: url(ba-h4bg-o-top.gif) no-repeat top left; }
  185.     #main .e h4 { background: url(ba-h4bg-e-top.gif) no-repeat top left; }
  186.  
  187.     #main .o h4 span.in { background: #2c557c url(ba-h4bg-o-bottom.gif) no-repeat bottom left; }
  188.     #main .e h4 span.in { background: #346694 url(ba-h4bg-e-bottom.gif) no-repeat bottom left; }
  189.  
  190.     #sidebar .o h4 { background: url(ms-h4bg-o-top.gif) no-repeat top left; }
  191.     #sidebar .e h4 { background: url(ms-h4bg-e-top.gif) no-repeat top left; }
  192.  
  193.     #sidebar .o h4 span.in { background: #2c557c url(ms-h4bg-o-bottom.gif) no-repeat bottom left; }
  194.     #sidebar .e h4 span.in { background: #346694 url(ms-h4bg-e-bottom.gif) no-repeat bottom left; }
  195.  
  196. #photo-page #main img { border: 2px solid #fff; }
  197. #photo-page .caption { color: #fff; padding: 2px 4px; text-align: center;}
  198.  
  199. ul {
  200.     padding-left:24px;
  201. }
  202.  
  203. li a {
  204.     text-decoration:none;
  205. }
  206.  
  207.  
  208.  
  209. h2 {
  210.     margin-top: 0px;
  211.     margin-left: -6px;
  212.     width: 449px;
  213.     padding: 5px 0 0 0;
  214.     font-size: 1.4em;
  215.     color: #fff;
  216.     background: url(h2bg-top.gif) no-repeat top left;
  217. }
  218.  
  219. * html h2 { margin-left: 0; }
  220.  
  221. h2 span.in { display: block; padding: 0 8px 5px 8px; background: #2c557c url(h2bg-bottom.gif) no-repeat bottom left; }
  222.  
  223. .no-sidebar h2 { height: 33px; line-height: 33px; margin-top: 2px; padding-top: 0; background:  url(headerbg-nosidebar.gif) no-repeat top left; width: 706px; }
  224. .no-sidebar h2 span.in { background: transparent; }
  225.  
  226. * html #page-content h3 { font-size: 1.1em; }
  227. * html #page-content h4 { font-size: 1em; }
  228. * html #page-content h5 { font-size: .8em; }
  229.  
  230. .article, .pagelet-body { padding-right:6px; padding-left:2px;}
  231.  
  232. .article p {
  233.     line-height: 1.4em;
  234.     margin:0px;
  235. }
  236.  
  237. .article-thumbnail {
  238.     float: left;
  239.     margin: 6px 6px 6px 0;
  240. }
  241.  
  242. .callout-container .callout {
  243.     clear: both;
  244.     float: left;
  245.     font-size: .9em;
  246.     margin-right: 8px;
  247.     margin-bottom: 12px;
  248.     border-right: 1px solid #2c557c;
  249.     padding-right: 6px;
  250.     padding-bottom: 6px;
  251.     margin-top: 14px;
  252.     width: 221px;
  253.     word-wrap: break-word;
  254. }
  255.  
  256. /* hack ie/mac */
  257. * html .callout-container .callout {
  258.     border-right: none;
  259. }
  260. /*\*/
  261. * html .callout-container .callout {
  262.     border-right: 1px solid #2c557c;
  263. }
  264. /**/
  265.  
  266. .callout-container .callout p { line-height: 1.1em; }
  267.  
  268. .article form, .article form .submit {
  269.     margin-bottom:0px;
  270. }
  271.  
  272.  
  273. /* Used for photo-index grids */
  274. .photogrid-index {
  275.     text-align:center;
  276.     margin:10px 2px;
  277. }
  278.  
  279. .photogrid-index a {    
  280.     color:#2c557c;
  281.     text-decoration:none;
  282.     font-weight:normal!important;
  283. }
  284.  
  285. .photogrid-index a:hover  {
  286.     text-decoration:underline!important;
  287. }
  288.  
  289. .gridItem {
  290.     float:left;
  291.     position:relative;
  292.     height:190px;    /* room for caption */
  293.     width: 140px;
  294.     font-size: .9em;
  295. }
  296.  
  297. .gridItem h3 {
  298.     font-size:1em;
  299.     font-weight:normal;
  300.     overflow:hidden;
  301.     padding:0px;
  302.     margin:0px;
  303.     position:absolute;
  304.     top: 142px; /* needs to leave 38px from the bottom of the gridItem¬†*/
  305.     width: 140px;
  306. }
  307.  
  308. .gridItem img {
  309.     border: 1px solid rgb(80, 80, 80);
  310.     margin: auto;
  311.     display:block;
  312.     position: absolute;
  313.     top: 0;
  314.     bottom: 40px;
  315.     right: 0;
  316.     left: 0;
  317. }
  318.  
  319.  
  320. /* IE Hack */
  321. /* Hides from IE5-mac \*/
  322. * html .gridItem img {
  323.     position: relative;
  324.     top:3px;
  325. }
  326.  
  327. * html .gridItem h3 {
  328.     position: relative;
  329.     top: 4px;
  330. }
  331. /* End hide from IE5-mac */
  332.  
  333.  
  334. /* Used on index summary pages */
  335.  
  336. .listing-index ul {
  337.     margin:0px;
  338. }
  339.         .listing-index li h3 {
  340.             margin:0px;
  341.         }
  342.  
  343.         .listing-index li h3 a {
  344.             text-decoration:none;
  345.             font-size:1em;
  346.             font-weight:normal;
  347.             color:rgb(44, 85, 124);
  348.         }
  349.  
  350. /* Individual Photo Pages */
  351.  
  352. .ImageElement, .VideoElement { 
  353.     text-align: center; 
  354. }
  355.  
  356. .photo-navigation {
  357.     float: right;
  358.     margin-top: -40px;
  359.     margin-right: 28px;
  360. }
  361.  
  362. * html .photo-navigation {     margin-top: -50px; margin-right: 12px; }
  363.  
  364.     .photo-navigation div {
  365.         margin-left: 18px;
  366.         width: 17px;
  367.         height: 20px;
  368.         float: left;
  369.     }
  370.  
  371.     .photo-navigation a {
  372.         display:block;
  373.         width:100%;
  374.         height:100%;
  375.         text-indent: -5000em;
  376.     }
  377.  
  378.     #previous-photo    {
  379.         background: url(photoprev-disabled.gif) no-repeat center center;
  380.     }
  381.     #previous-photo a {
  382.         background: url(photoprev.gif) no-repeat center center;
  383.     }
  384.  
  385.     #next-photo {
  386.         background: url(photonext-disabled.gif) no-repeat center center;
  387.     }
  388.     #next-photo a {
  389.         background: url(photonext.gif) no-repeat center center;
  390.     }
  391.  
  392.     #photo-list {
  393.         width: 22px;
  394.         background: url(photolist-disabled.gif) no-repeat center center;
  395.     }
  396.     #photo-list a {
  397.         width: 22px;
  398.         background: url(photolist.gif) no-repeat center center;
  399.     }
  400.  
  401.             #page-bottom {
  402.                 height: 42px;
  403.                 background: url(mod_footerbg.gif) no-repeat top left;
  404.                 padding: 40px 30px 0 30px;
  405.                 font-size: .9em;
  406.                 color: #fff;
  407.             }
  408.             
  409.                 #page-bottom div {
  410.                     height: 20px;
  411.                     overflow:hidden;
  412.                 }
  413.  
  414.                 #page-bottom p {
  415.                     display:inline;
  416.                     margin: 0;
  417.                 }
  418.                 
  419.                 #page-bottom p+p:before {
  420.                     content:' \002022  ';
  421.                 }
  422.  
  423.